/*
  学习目标：JSX中使用插值表达式-三元运算符、函数调用、逻辑运算符
  常用表达式
  1. 基本类型的值：
    1.1 字符串、数字
    2.2 💥undefined、null、布尔值都不显示
  2. 数组和对象
     2.1. 对象，不允许直接放jsx
     2.2. 数组，React中数组内的元素，会被当做一个个的虚拟DOM ，会渲染出来
  3. 三元运算符、函数调用、逻辑运算符

  注意：💥for if 等语句都不能放表达式
*/

import React from 'react';
import ReactDOM from 'react-dom';

const isShow = true;

function getMsg() {
  return '张三，法外狂徒';
}

const ulNode = (
  <div>
    {/* 1. 三元运算符 */}
    <h1>三元运算符: {isShow ? '显示' : '不显示'}</h1>
    {/* 2. 函数调用 */}
    <h2>函数调用： {getMsg()}</h2>
    {/* 3. 逻辑运算符 */}
    <h3>逻辑运算符： {isShow && '张三'}</h3>
  </div>
);

ReactDOM.render(ulNode, document.getElementById('root'));
